<%@ include file="../common/IncludeTop.jsp"%>

<h2 align="center">My Orders</h2>
<style type="text/css">

	table {
		width: 700px;
		padding: 0;
		margin: 0;
	}

	caption {
		padding: 0 0 5px 0;
		width: 700px;
		font: italic 16px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		text-align: right;
	}

	th {
		font: bold 16px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		color: #4f6b72;
		border-right: 1px solid #C1DAD7;
		border-bottom: 1px solid #C1DAD7;
		border-top: 1px solid #C1DAD7;
		letter-spacing: 2px;
		text-transform: uppercase;
		text-align: left;
		padding: 6px 6px 6px 12px;
		background: #d5eaca no-repeat;
	}

	th.nobg {
		border-top: 0;
		border-left: 0;
		border-right: 1px solid #C1DAD7;
		background: none;
	}

	td {
		border-right: 1px solid #C1DAD7;
		border-bottom: 1px solid #C1DAD7;
		background: #8FBC8F;
		font-size:16px;
		padding: 6px 6px 6px 12px;
		color: 	#F5FFFA;
	}


	td.alt {
		background: #F5FAFA;
		color: #797268;
	}

	th.spec {
		border-left: 1px solid #C1DAD7;
		border-top: 0;
		background: #fff no-repeat;
		font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	}

	th.specalt {
		border-left: 1px solid #C1DAD7;
		border-top: 0;
		background: #f5fafa no-repeat;
		font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		color: #797268;
	}
</style>

<style>
	body{
		background: #8FBC8F ;
	}

	.button{
		cursor: pointer;
		width: 180px;
		line-height: 38px;
		text-align: center;
		font-weight: bold;
		color: #fff;
		text-shadow:1px 1px 1px #333;
		border-radius: 5px;
		margin:0 20px 20px 0;
		position: relative;
		overflow: hidden;
	}
	.button:nth-child(6n){
		margin-right: 0;
	}
	.button.green{
		border:1px solid #64c878;
		box-shadow: 0 1px 2px #b9ecc4 inset,0 -1px 0 #6c9f76 inset,0 -2px 3px #b9ecc4 inset;
		background: -webkit-linear-gradient(top,#90dfa2,#84d494);
		background: -moz-linear-gradient(top,#90dfa2,#84d494);
		background: linear-gradient(top,#90dfa2,#84d494);
	}
	.green:hover{
		background: -webkit-linear-gradient(top,#aaebb9,#82d392);
		background: -moz-linear-gradient(top,#aaebb9,#82d392);
		background: linear-gradient(top,#aaebb9,#82d392);
	} .green:active{
		  top:1px;
		  box-shadow: 0 1px 3px #4d7254 inset,0 3px 0 #fff;
		  background: -webkit-linear-gradient(top,#5eac6e,#72b37e);
		  background: -moz-linear-gradient(top,#5eac6e,#72b37e);
		  background: linear-gradient(top,#5eac6e,#72b37e);
	  }
	.okTips{
		color:green;
	}
	.errorTips{
		color:red;
	}
</style>
<style type="text/css">
	#Banner,#PoweredBy{
		background-color:#8FBC8F;
	}
</style>
<style type="text/css">

	table {
		width: 700px;
		padding: 0;
		margin: 0 auto;
	}

	caption {
		padding: 0 0 5px 0;
		width: 700px;
		font: italic 16px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		text-align: right;
	}

	th {
		font: bold 16px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		color: #4f6b72;
		border-right: 1px solid #C1DAD7;
		border-bottom: 1px solid #C1DAD7;
		border-top: 1px solid #C1DAD7;
		letter-spacing: 2px;
		text-transform: uppercase;
		text-align: left;
		padding: 6px 6px 6px 12px;
		background: #d5eaca no-repeat;
	}

	th.nobg {
		border-top: 0;
		border-left: 0;
		border-right: 1px solid #C1DAD7;
		background: none;
	}

	td {
		border-right: 1px solid #C1DAD7;
		border-bottom: 1px solid #C1DAD7;
		background: #fff;
		font-size:16px;
		padding: 6px 6px 6px 12px;
		color: #4f6b72;
	}


	td.alt {
		background: #F5FAFA;
		color: #797268;
	}

	th.spec {
		border-left: 1px solid #C1DAD7;
		border-top: 0;
		background: #fff no-repeat;
		font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	}

	th.specalt {
		border-left: 1px solid #C1DAD7;
		border-top: 0;
		background: #f5fafa no-repeat;
		font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		color: #797268;
	}
</style>
<table>
	<tr>
		<th>Order ID</th>
		<th>Date</th>
		<th>Total Price</th>
	</tr>

	<c:forEach var="order" items="${sessionScope.orderList}">
		<tr>
			<td>
			<a href="ViewOrder?orderId=${order.orderId}" name="orderId" value="${order.orderId}">${order.orderId}</a></td>
			<td><fmt:formatDate value="${order.orderDate}"
				pattern="yyyy/MM/dd hh:mm:ss" /></td>
			<td><fmt:formatNumber value="${order.totalPrice}"
				pattern="$#,##0.00" /></td>
		</tr>
	</c:forEach>
</table>

<%@ include file="../common/IncludeBottom.jsp"%>


